import {ref} from 'vue'
import {COLOR_THEME} from '@/common/storageKeys'

// 主题
export const useDark = () => {
  const isDark = ref(localStorage.getItem(COLOR_THEME) === 'dark')
  isDark.value && document.documentElement.classList.add('dark')
  const toggleDark = (dark) => {
    isDark.value = dark
    // 切换html的class
    document.documentElement.classList.toggle('dark')
    // 存储当前主题
    localStorage.setItem(COLOR_THEME, isDark.value ? 'dark' : 'auto')
  }
  return [isDark, toggleDark]
}
